// 等待页面DOM完全加载完成后执行
document.addEventListener('DOMContentLoaded', function () {
    // 获取登录表单元素
    const loginForm = document.getElementById('loginForm');
    // 获取用户名输入框
    const usernameInput = document.getElementById('username');
    // 获取密码输入框
    const passwordInput = document.getElementById('password');
    // 获取错误提示元素（两个输入框对应的提示）
    const usernameError = usernameInput.nextElementSibling;
    const passwordError = passwordInput.nextElementSibling;

    // 监听表单提交事件
    loginForm.addEventListener('submit', function (e) {
        // 阻止表单默认提交行为（避免页面刷新）
        e.preventDefault();

        // 初始化验证状态（默认通过）
        let isUsernameValid = true;
        let isPasswordValid = true;

        // 1. 用户名非空验证
        const username = usernameInput.value.trim(); // 去除首尾空格
        if (username === '') {
            isUsernameValid = false;
            usernameInput.classList.add('error'); // 添加错误样式（红色边框）
            usernameError.textContent = '用户名不能为空！'; // 显示错误提示
        } else {
            usernameInput.classList.remove('error'); // 移除错误样式
            usernameError.textContent = ''; // 清空错误提示
        }

        // 2. 密码非空验证
        const password = passwordInput.value.trim();
        if (password === '') {
            isPasswordValid = false;
            passwordInput.classList.add('error'); // 添加错误样式
            passwordError.textContent = '密码不能为空！'; // 显示错误提示
        } else {
            passwordInput.classList.remove('error'); // 移除错误样式
            passwordError.textContent = ''; // 清空错误提示
        }

        // 3. 所有验证通过：模拟登录成功
        if (isUsernameValid && isPasswordValid) {
            alert(`登录成功！欢迎您，${username}！`);
            window.location.href = "index.html";
        }
    });
});